<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../js/ajax.js"></script>
</head>

<body>

</body>
<script>
    // Promise

    // Promise的拓展方法  => 给实例化对象用(动态方法)
    // p.then()
    // p.catch()
    // p.finally()


    // 构造函数的Promise的方法  => 构造函数自己用(静态方法  Array.isArray Date.now)
    // Promise.all()
    // Promise.race()
    // Promise.resolve()
    // Promise.reject()


    // Promise.race()方法同样是将多个 Promise 实例，包装成一个新的 Promise 实例。
    // const p = Promise.race([p1, p2, p3]);
    // Promise.race()方法接受一个数组作为参数，p1、p2、p3都是 Promise 实例

    // p的状态由p1、p2、p3决定，分成两种情况。

    // 只要p1、p2、p3之中有一个实例率先改变状态，p的状态就跟着改变。那个率先改变的 Promise 实例的返回值，就传递给p的回调函数


    // 特征:
    // 1. 同时发送请求,按最快的来 (无论是成功 还是失败)

    // 同时发送三个请求 => 得到三个Promise实例
    var p1 = readTxt("../data/1.txt", 1000); // 你好
    var p2 = readTxt("../data/2.txt", 500);  // 今天
    var p3 = readTxt("../data/3.txt", 2000); // 学习Promise
    console.log(p1, p2, p3);

    var p = Promise.race([p1, p2, p3]);
    console.log(p);

    p.then(function (list) {
        console.log("fulfilled", list);
    }).catch(function (err) {
        console.log("rejected", err);
    })

    //-------------------------------------------------
    // Promise.myRace = function (list) { // [p1, p2, p3]
    //     return new Promise(function (resolve, reject) {
    //         var arr = [];
    //         var count = 0;
    //         for (let i = 0; i < list.length; i++) {
    //             let p = list[i];  // p1, p2, p3 
    //             p.then(res => {
    //                 resolve(res);
    //             }).catch(err => {
    //                 reject(err);
    //             })
    //         }
    //     })
    // }

    // var p1 = readTxt("../data/1.txt", 1000); // 你好
    // var p2 = readTxt("../data/2.txt", 500);  // 今天
    // var p3 = readTxt("../data/3.txt", 2000); // 学习Promise
    // console.log(p1, p2, p3);

    // var p = Promise.myRace([p1, p2, p3]);
    // console.log(p);

    // p.then(function (list) {
    //     console.log("fulfilled", list);
    // }).catch(function (err) {
    //     console.log("rejected", err);
    // })

















    function readTxt(url, delay = 0, isFulfilled = true) {
        var p = new Promise(function (resolve, reject) {
            setTimeout(function () {
                if (isFulfilled == false) {
                    reject("已失败");
                }
                $.ajax({
                    type: "get",
                    url: url,
                    success: function (txt) {
                        resolve(txt);
                    },
                    error: function (err) {
                        reject(err);
                    }
                })
            }, delay);
        })
        return p; // {pending:undefind} Promise实例 (请求有结果后改变状态)
    }



</script>

</html>